<template>
	<view>
		<navbar  title="支付订单" :isGoBack="true" :isNotice="true" ></navbar>	
		
		<view class="pay_top">
		    <text style="font-size:40rpx;margin-bottom: 5rpx;">{{goods_total}}</text>
		    <text style="padding-bottom: 14rpx;margin-top: 10rpx;">支付金额</text>
		  </view>
		
		<view class="mian">
		   <text>支付方式</text>
		   <view>
		    <radio-group name="sex" @change="radioChange">
		        <view class="pay_type">
					<view class="flex justify-center">
					  <image src="/static/common/61e653b7826a43d4ac957b46ef11cba3.png"  class="pay_image"></image>
					  <text style="margin-left: 20rpx;">微信支付</text>
					</view>		
		           <view class="flex">
		               <radio class="mr-30" color="#2B91ED" :checked="(radio==1?true:false)" value="1" ></radio>
		            </view>
		        </view>
		        <view class="pay_type">
					<view class="flex justify-center">
						<image src="/static/common/20230613114451.png"  class="pay_image"></image>
						<text style="line-height: 2.55556;margin-left: 20rpx;">余额支付</text>
					</view>		          
		            <view class="flex ">
		                <radio class="mr-30" color="#2B91ED" :checked="(radio==2?true:false)" value="2" ></radio>
		            </view>
		        </view>
		     </radio-group>
		   </view>
		</view>
		<view class="submit" @click="wxPay">
		  <u-button type="primary" custom-style="width:400rpx;border-radius:13rpx">立即支付</u-button>
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data () {
			return {
				radio: '1',
				order_no:"",
				orderpay:1,
				goods_total:1.23,
				
			}
		},
		onLoad(options) {
		    if(options){
		        this.order_no=options.order_no
				this.goods_total=options.goods_total
				this.orderpay=options.orderpay
		    }  
		},
		onUnload () {
		    /*关闭所有页，打开url指定页面*/
		    uni.switchTab({
		      url: '/pages/order/index'
		    })		   
		},
		      
		onShow(){
		},
		methods:{
			radioChange(event) {
			    this.radio=event.detail.value
			},
			wxPay(){
			    let orderpay=this.orderpay
				let that=this
				let obj_data={
				  token:uni.getStorageSync('userInfo').app_openid,
				  login_type:'app',
				  pay_type:this.radio==1?"alipay":"account",
				  pay_no:this.order_no
				}
				
				if(obj_data.pay_type=="alipay"){//立即支付订单   
					this.$http.orderpay(obj_data).then(rest=>{
					    if(rest.resCode=="9999"){
					        console.log(rest.data.data)							
							my.tradePay({
							  tradeNO:rest.data.data,
							  success: (res1) => {
								  console.log(res1,'支付成功 res1')
								  if(res1.resultCode == 9000){
									  // 文档上说9000是成功，到这里就成功了
								  }else {
									 // 支付不成功，具体原因看返回，去对照文档
								  }
							  },
							  fail: (err1) => {
								 // 支付不成功，具体原因看返回，去对照文档
								   console.log(err1,'支付不成功 err1')
							  }
							});
							
							
							// uni.requestPayment({
							//         provider: 'alipay',
							//         orderInfo: rest.data.data,
							//         success: (res) => {
							//             this.handleSuccess(res)
							//         },
							//         fail: (err) => {
										
							//             this.handleFail(err)
							//         }
							//     });
								
								
							
							return
					    }else{
					        uni.showToast({
					            title: rest.resMessage,
					            icon: 'error',
					            duration: 2000,
					            //显示透明蒙层，防止触摸穿透
					            mask:true,
					        })
					    }
					})	
				}else{					
					this.$http.orderpay(obj_data).then(rest=>{
					    if(rest.resCode=="9999"){
					        uni.showToast({
					            title: '支付成功',
					            icon: 'success',
					            duration: 2000,
					            //显示透明蒙层，防止触摸穿透
					            mask:true,	
								success: function () {
								  setTimeout(function () {									
									//要延时执行的代码
									uni.switchTab({
										url: '/pages/order/index',
										
									})
								  }, 1500) //延迟时间
								}
					        })
					    }else{
					        uni.showToast({
					            title: rest.resMessage,
					            icon: 'error',
					            duration: 2000,
					            //显示透明蒙层，防止触摸穿透
					            mask:true,
					        })
					    }
					})					
				}
			}
		}
	}
</script>

<style>
	/* pagesOrder/wxPay/index.wxss */
	page{
	  background-color: white;
	}
	
	.pay_top{
	  display: flex;    /*设置显示样式**/
	  flex-direction:column; /**子view排列方式row--水平 column--垂直*/
	  align-items: center;    /**子view垂直居中*/
	  vertical-align: center; /**垂直居中*/
	  justify-content: center; /**内容居中*/ 
	  background: white;
	  margin-top: 60rpx;
	  font-size:28rpx;
	  border-bottom: 1rpx solid rgb(233, 225, 225);
	
	}
	.mian{
	  display: flex;    /*设置显示样式**/
	  flex-direction:column; /**子view排列方式row--水平 column--垂直*/
	  margin-top: 30rpx;
	  margin-left:20rpx ;
	  font-size:28rpx;
	}
	.pay_type{
	  display:flex;
	  flex-direction: row;
	  margin-top: 20rpx;
	  height: 70rpx;
	  margin-left: 30rpx;
	  justify-content: space-between;
	  align-items: center;
	}
	.pay_image{  
	  width: 70rpx;
	  height: 70rpx;
	}
	.submit{
	  display: flex;    /*设置显示样式**/
	  flex-direction:column; /**子view排列方式row--水平 column--垂直*/
	  align-items: center;    /**子view垂直居中*/
	  vertical-align: center; /**垂直居中*/
	  justify-content: center; /**内容居中*/ 
	  margin-top: 25rpx;
	  
	}
</style>